<template>
	<view class="footer" :class="isIos?'footerIos':''">
		<view class="footer-time" @tap="handleClick">
			<image class="footer-icon"
				src="https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/e519f234606e4b18937477cea78b8cd3_mergeImage.png"
				mode="aspectFit">
			</image>

			<text class="footer-number">{{number}}</text>
			<text class="footer-text">预计 <text class="footer-blue">{{time}}</text> 分钟</text>
		</view>
		<view class="footer-next" @tap="handleClick2">
			下一步
		</view>
	</view>
</template>

<script>
	export default {
		name: "ProcessTime",
		props: {
			
			time: Number,
			number: Number,
			isIos: {
				type:Boolean,
				default:false
			},
		},
		
		
		watch: {
		    time(newVal) {
				// console.log(newVal,'12')
		       // 处理message变化的逻辑
		     },
		     number(newVal, oldVal) {
				 // console.log(newVal,'11')
		       // 处理anotherProp变化的逻辑
		     }
		  },
		data() {
			return {
				// time: 0,
				// number: 0,
			};
		},
		methods: {
			handleClick() {
				this.$emit('handleEvent');
			},
			handleClick2() {
				this.$emit('handleEvent2');
			}
		}
	}
</script>

<style>
	.footer {
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 999;
		width: calc(100vw - 52rpx);
		background-color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding:26rpx 32rpx;
	}
	.footerIos{
		padding: 30rpx 32rpx 0;
	}

	.footer-time {
		position: relative;
		display: flex;
		align-items: center;
	}

	.footer-icon {
		width: 48rpx;
		height: 48rpx;
		margin-right: 16rpx;
	}

	.footer-number {
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		left: 32rpx;
		top: -20rpx;
		width: 32rpx;
		height: 32rpx;
		color: #FFFFFF;
		font-size: 20rpx;
		border-radius: 50%;
		border: 1px solid rgba(255, 255, 255, 1);
		box-shadow: 0 1px 8rpx 0 rgba(255, 0, 48, 0.2);
		background-color: rgba(244, 51, 60, 1);
	}

	.footer-text {
		color: rgba(51, 51, 51, 1);
		font-size: 28rpx;
		font-family: PingFangSC-Regular;
		font-weight: normal;
		white-space: nowrap;
		line-height: 40rpx;
	}

	.footer-blue {
		color: rgba(41, 121, 255, 1);
		font-size: 28rpx;
		font-family: PingFangSC-Regular;
		font-weight: normal;
		white-space: nowrap;
		line-height: 40rpx;
		margin: 0 10rpx;
	}

	.footer-next {
		width: 240rpx;
		height: 88rpx;
		border-radius: 45rpx;
		border: 1px solid rgba(41, 121, 255, 1);
		color: rgba(41, 121, 255, 1);
		font-size: 30rpx;
		font-family: PingFangSC-Medium;
		font-weight: bold;
		text-align: center;
		line-height: 86rpx;
	}
</style>